<template>
  <div id="cqd">
    <el-row>
      <el-table :data="table.data" v-if="zbjcdata.mineName=='鹤煤六矿'">
        <el-table-column type="index" label="序号" width="70"></el-table-column>
        <el-table-column prop="qymc" label="企业名称" show-overflow-tooltip></el-table-column>
        <el-table-column prop="cgqbh" label="传感器编号"  show-overflow-tooltip></el-table-column>
        <el-table-column prop="jclx" label="监测类型" show-overflow-tooltip></el-table-column>
        <el-table-column prop="yclx" label="异常类型" show-overflow-tooltip></el-table-column>
        <el-table-column prop="azwz" min-width="120" label="安装位置" show-overflow-tooltip></el-table-column>
        <el-table-column prop="kssk" min-width="120" label="开始时刻" show-overflow-tooltip></el-table-column>
        <el-table-column prop="jssk" label="结束时刻" show-overflow-tooltip></el-table-column>
        <el-table-column prop="cxsc" label="持续时长" show-overflow-tooltip></el-table-column>
        <el-table-column prop="zdz" label="最大值" show-overflow-tooltip></el-table-column>
        <el-table-column prop="zxz" label="最小值" show-overflow-tooltip></el-table-column>
        <el-table-column prop="pjz" label="平均值" show-overflow-tooltip></el-table-column>
      </el-table>
      <el-table :data="table.data" v-if="zbjcdata.type=='risk'">
        <el-table-column type="index" label="序号" width="70"></el-table-column>
        <el-table-column prop="pro" min-width="40" label="省" show-overflow-tooltip></el-table-column>
        <el-table-column prop="mine_name" min-width="240" label="煤矿名称"  show-overflow-tooltip></el-table-column>
        <el-table-column prop="bs_date" label="辨识时间" show-overflow-tooltip></el-table-column>
        <el-table-column prop="xhfxd" label="巡检风险点" show-overflow-tooltip></el-table-column>
        <el-table-column prop="fx_level" min-width="60" label="风险级别" show-overflow-tooltip></el-table-column>
        <el-table-column prop="fx_des" min-width="300" label="风险描述" ></el-table-column>
      </el-table>
      <el-table :data="table.data" v-if="zbjcdata.type=='yinhuan'">
        <el-table-column type="index" label="序号" width="70"></el-table-column>
        <el-table-column prop="pro" min-width="60" label="省" show-overflow-tooltip></el-table-column>
        <el-table-column prop="mine_name" min-width="260" label="煤矿名称"  show-overflow-tooltip></el-table-column>
        <el-table-column prop="pc_time" min-width="120" label="排查时间" show-overflow-tooltip></el-table-column>
        <el-table-column prop="yh_level" label="隐患级别" show-overflow-tooltip></el-table-column>
        <el-table-column prop="zl_date" min-width="120" label="治理期限" show-overflow-tooltip></el-table-column>
        <el-table-column prop="yh_desc" min-width="200" label="隐患描述"></el-table-column>
        <el-table-column prop="fxd" min-width="120" label="风险点" show-overflow-tooltip></el-table-column>
        <el-table-column prop="zg_status" min-width="80" label="整改状态" show-overflow-tooltip></el-table-column>
      </el-table>
    </el-row>
    <!-- 分页信息栏 -->
    <el-row class="pagination-bar">
      <el-col :span="8" class="page-info">显示第&nbsp;{{currentStart}}&nbsp;至&nbsp;{{currentEnd}}&nbsp;项结果，共&nbsp;{{table.total}}&nbsp;项</el-col>
      <el-col :span="16" class="text-right">
        <el-pagination
          layout="prev,pager,next,jumper"
          :total="table.total"
          :current-page.sync="table.currentPage"
          :page-size="table.pageSize"
          @current-change="initData"
        ></el-pagination>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  props: {
    zbjcdata: {
      type: Object,
      default: {}
    }
  },
  data() {
    return {
      table: {
        data: [], //数据
        total: 0, //总条数
        currentPage: 1, //当前页码
        pageSize: 10 //每页条数
      },
    };
  },

  mounted() {
    this.initData();
  },
  computed: {
    // 数据起点
    currentStart() {
      return this.table.total == 0
        ? 0
        : (this.table.currentPage - 1) * this.table.pageSize + 1;
    },
    // 数据终点
    currentEnd() {
      return this.currentStart == 0
        ? 0
        : this.currentStart + this.table.pageSize - 1 > this.table.total
        ? this.table.total
        : this.currentStart + this.table.pageSize - 1;
    }
  },
  methods: {
    initData() {
      if(this.zbjcdata.mineName=='鹤煤六矿'){
        this.request({
          url: "data/getData/3.17",
          method: "get"
        }).then(data => {
          this.table.total = data.data.length;
          this.table.data = data.data.slice(1,11);
        });
      }
      if(this.zbjcdata.name=="重大风险"){
        this.request({
          url: "data/getByV/fxqd/fx_level='重大风险' limit 10",
          method: "get"
        }).then(data => {
          this.table.data = data.data;
          this.table.total = 63;
        });
      }
      if(this.zbjcdata.name=="较大风险"){
        this.request({
          url: "data/getByV/fxqd/fx_level='较大风险' limit 10",
          method: "get"
        }).then(data => {
          this.table.data = data.data;
          this.table.total = 123;
        });
      }
      if(this.zbjcdata.name=="一般风险"){
        this.request({
          url: "data/getByV/fxqd/fx_level='一般风险' limit 10",
          method: "get"
        }).then(data => {
          this.table.data = data.data;
          this.table.total = 186;
        });
      }
      if(this.zbjcdata.name=="低风险"){
        this.request({
          url: "data/getByV/fxqd/fx_level='低风险' limit 10",
          method: "get"
        }).then(data => {
          this.table.data = data.data;
          this.table.total = 251;
        });
      }
      if(this.zbjcdata.name=="重大隐患"){
        this.request({
          url: "data/getByV/yhzl/yh_level='重大隐患' limit 10",
          method: "get"
        }).then(data => {
          this.table.data = [];
          this.table.total = 0;
        });
      }
      if(this.zbjcdata.name=="一般隐患"){
        this.request({
          url: "data/getByV/yhzl/yh_level='一般隐患' limit 10",
          method: "get"
        }).then(data => {
          this.table.data = data.data;
          this.table.total = 128;
        });
      }
    },
  }
};
</script>
<style lang="less" scoped>
#cqd /deep/ ::-webkit-scrollbar-thumb {
  background-color: #dddddd !important;
}
</style>